<%template _header%>
<%namespace YouHP.Model%>
<!--header end-->

<script type="text/javascript">
function changeAvatarOption(currentOption)
{
	if ($('enterurl'))
	{
		$('enterurl').style.display='none';
	}
	if ($('uploadfile'))
	{
		$('uploadfile').style.display='none';
	}
	switch (currentOption)
	{
		case "0":
			break;
		case "1":
			$('uploadfile').style.display='block';
			break;
		case "2":
			$('enterurl').style.display='block';
			break;
	}
}
</script>

<!--NtForumLocation start-->
<div id="foruminfo">
	<div class="userinfo">
		<h2><a href="{Config.WebsiteUrl}/Index.aspx" class="home">{Config.WebsiteTitle}</a>
			&nbsp;&gt;&nbsp;<a href="{Config.WebsiteUrl}/Member/Manage.aspx">用户中心</a>
			<strong>头像设置</strong></h2>	</div>
	<div class="forumstats">
		<div id="search">
				<%template _quicksearch%>
		</div>
	</div>
</div>

<!--NtForumLocation end-->

<!--主体-->
<div class="controlpannel">
   <%template _memmenu%>
	<div class="pannelcontent">
		<div class="pcontent">
			<div class="panneldetail">
				<%template _membasemenu%>	
				<div class="pannelbody">
					<div class="pannellist">
					<%if {ErrorCount}==0%>
					
						<%if {IsPost}%>
						
							<%template _msgbox%>
							
						<%else%>
						
						<form action="" method="post" ID="Form1" enctype="multipart/form-data">
								<div class="photoimg" style="border-top:1px dashed #CCC; margin-bottom:10px; ">
								<img src="{User.Avatar}" width="100" height="100" id="usingavatarimg" alt="形象图"/>
									<%if {UserGroupInfo.AllowAvatar}>0%>
									
										<ul id="avatarbox">
											
										<%if {UserGroupInfo.AllowAvatar}>1%>
											<li>
												<input type="radio" id="avatartype1" name="avatartype" value="2" onclick="changeAvatarOption(this.value);"
												<%if avatartype==2%>
													checked="checked"
												<%/if%>/><label for="avatartype1">使用外部图片</label>
												<div id="enterurl" style="display: none;">
													URL地址: <input name="avatarurl" type="text" class="colorblue" id="avatarurl" onfocus="this.className='colorfocus';" onblur="this.className='colorblue';"  size="40" />
												</div>
											</li>
										<%/if%>
										
										<%if {UserGroupInfo.AllowAvatar}>2%>
											<li>
												<input type="radio" id="avatartype2" name="avatartype" value="1" onclick="changeAvatarOption(this.value);"
												<%if avatartype==1%>
													checked="checked"
												<%/if%>/><label for="avatartype2">上传头像图片</label>
												<div id="uploadfile" style="display: none;">
												选择本地图片文件: <input name="file" id="file" type="file" size="40" class="colorblue" onfocus="this.className='colorfocus';" onblur="this.className='colorblue';" />
												</div>
											</li>
											
										
										<%/if%>
										
										<li>
											<input type="radio" id="avatartype3" name="avatartype" value="0" onclick="changeAvatarOption(this.value);BOX_show('fromsystem');" 
											<%if avatartype==0%>
												checked="checked"
											<%/if%>
											/><label for="avatartype3">使用系统头像 (点击选择...)</label>
											<input type="hidden" name="usingavatar" id="usingavatar" />
										</li>
										
										</ul>
										
									<%else%>
									
										<ul style="margin-top: 40px;"><li>您所在的用户组 "{UserGroupInfo.Name}" 没有更改头像的权限</li></ul>
										
									<%/if%>
									
								</div>
								<input id="sendmsg" class="sbutton" type="submit" value="确定" name="sendmsg"/>
						  </form>
						  <%/if%>
						</div>
						
					<%else%>
					
						<%template _memerrmsgbox%>
						
					<%/if%>
			  </div>
			</div>
		</div>
	</div>
</div>
<!--主体-->
</div>
<%template _copyright%>
<%if {ErrorCount}==0 && !{IsPost}%>
	<div id="BOX_overlay" style="background: #000; position: absolute; z-index:100; filter:alpha(opacity=50);-moz-opacity: 0.6;opacity: 0.6;"></div>
	<script type="text/javascript" src="/support/dnt/album.js"></script>
	<script type="text/javascript">
		function usethisavatar(e)
		{
			$('usingavatar').value = e.src;
			
			var avatars = $('fromsystem').getElementsByTagName('div');
			for (var i=0; i < avatars.length;i++)
			{
				avatars[i].style.border = "2px dashed white";
			}
			e.parentNode.style.border = "2px dashed black";
		}
		function selectionborder(e)
		{
			if (e.style.border != "2px dashed black" && e.style.border != "black 2px dashed")
			{				
				if (e.style.border == "2px dashed red" || e.style.border == "red 2px dashed" )
				{
					e.style.border = "2px dashed white";
				}
				else
				{
					e.style.border = "2px dashed red";
				}
			}
		}
	</script>

	<div id="fromsystem" class="avatarbackground" style="display: none; position: relative;">
			<div class="avatarlist">
				<ul>
					<%loop avatarfile AvatarfileList%>
						<li>
							<div onmouseover="selectionborder(this)" onmouseout="selectionborder(this)" style="<%if {avatarfile["filename"]}=={User.Avatar}%>border: 2px dashed black;<%else%>border: 2px dashed white;<%/if%>cursor: pointer; overflow:hidden; zoom:1;" ><img src="{avatarfile["filename"]}" onclick="usethisavatar(this);" alt="形象图名称"/></div>
						</li>
					<%/loop%>
				</ul>
			</div>
			<span class="avatarbutton">
				<input type="button" name="userthisavatar" id="userthisavatar" class="sbutton" value="确定" onclick="$('usingavatarimg').src=$('usingavatar').value;BOX_remove('fromsystem');" />
				<input type="button" name="canceluserthisavatar" id="canceluserthisavatar" class="sbutton" value="取消" onclick="BOX_remove('fromsystem');" />
			</span>
	</div>
<%/if%>
<%template _footer%>